<template>
	<view class="">
		<search placeholder="请输入车牌号/车架号" @input="inputChange"></search>
		<mescroll-uni
			ref="mescrollRef"
			@init="mescrollInit"
			@down="downCallback"
			:top="'100rpx'"
			@up="upCallback">
			<uni-list>
				<view
					class="item"
					@click="chooseCar(item)"
					v-for="(item, index) in listdata"
					:key="item.carId">
					<text class="title">车牌号:{{ item.carNo | filterNull }}</text>
					<u-line color="#efefef" style="margin-bottom: 30rpx; display: block"></u-line>
					<title-content title="车架号:" :content="item.vinNo"></title-content>
					<title-content title="车辆归属:" :content="item.deptName"></title-content>
					<title-content title="车辆仓库:" :content="item.depotName"></title-content>
					<title-content
						title="品牌/车系/车型:"
						:content="
							item.brandName + '/' + item.seriesName + '/' + item.modelName
						"></title-content>
				</view>
			</uni-list>
		</mescroll-uni>
	</view>
</template>

<script>
	import titleContent from 'components/global/title-content.vue';
	import search from '../../../components/search.vue';
	import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js';
	export default {
		mixins: [MescrollMixin],
		components: {
			titleContent,
			search,
		},

		data() {
			return {
				page: 1,
				listdata: [],
				searchWord: '',
				modelId: '',
				depotId: '',
				deptId: '',
				type: '',
			};
		},
		onLoad(op) {
			this.modelId = uni.$u.test.isEmpty(op.modelId) ? '' : op.modelId;
			this.depotId = uni.$u.test.isEmpty(op.depotId) ? '' : op.depotId;
			this.deptId = uni.$u.test.isEmpty(op.deptId) ? '' : op.deptId;
			this.type = uni.$u.test.isEmpty(op.type) ? '' : op.type;
		},

		methods: {
			//获取数据
			getData() {
				this.$u.api
					.getCarList({
						keyword: this.searchWord,
						pageNo: this.page,
						type: this.type,
						modelId: this.modelId,
						depotId: this.depotId,
						deptId: this.deptId,
					})
					.then(res => {
						if (this.page == 1) {
							this.listdata = [];
						}
						this.listdata = this.listdata.concat(res);
						this.mescroll.endSuccess(res.length);
					})
					.catch(() => {
						this.mescroll.endErr();
					});
			},

			//上拉加载回调
			upCallback(page) {
				console.log('触发了上拉加载' + page);

				this.page = page.num;
				this.getData();
			},
			//搜索监听事件
			inputChange(value) {
				this.searchWord = value;
				this.getData();
			},
			//选择车辆
			chooseCar(item) {
				if (uni.$u.test.isEmpty(this.modelId)) {
					//获取所有页面的栈实例列表
					let pages = getCurrentPages();
					//当前页面
					let nowPage = pages[pages.length - 1];
					//上个页面
					let prevPage = pages[pages.length - 2];

					if (!uni.$u.test.isEmpty(prevPage.$vm.allocationInfo)) {
						prevPage.$vm.allocationInfo.carPlate = item.carNo;
						prevPage.$vm.allocationInfo.carId = item.carId;
						prevPage.$vm.allocationInfo.vin = item.vinNo;
						let carInfo = item.brandName + '/' + item.seriesName + '/' + item.modelName;
						prevPage.$vm.allocationInfo.carInfo = carInfo;
						prevPage.$vm.allocationInfo.warehouseIdOld = item.depotId;
						prevPage.$vm.allocationInfo.warehouseNameOld = item.depotName;
						prevPage.$vm.allocationInfo.transferDeptIdOld = item.deptId;
						prevPage.$vm.allocationInfo.transferDeptNameOld = item.deptName;
						prevPage.$vm.allocationInfo.storageTime = item.storageTime;
					}
				}

				uni.$emit('selCar', item);
				uni.navigateBack();
			},
		},
	};
</script>

<style>
	.title-container {
		display: flex;
		align-items: center;
	}
	.title {
		width: 85%;
		height: 80rpx;
		line-height: 80rpx;
		font-size: 28rpx;
		color: $black33;
		margin-left: 20rpx;
	}
	.rightContent {
		margin-right: 10rpx;
		justify-content: flex-end;
	}
</style>
